<template>
  <div>
    <h2>品牌管理2</h2>
    <input type="text" v-model="name" />
    <button @click="add">点击新增</button>
    <h4 v-for="item in arr" :key="item.id">{{ item.name }}</h4>
  </div>
</template>

<script>
import { getBrand, brandAdd } from "../request/api";
export default {
  data() {
    return {
      arr: [],
      name: "",
    };
  },
  created() {
    // getBrand().then((res) => {
    //   this.arr = res.list;
    // });
    this.getBrandList()
  },
  methods: {
    getBrandList() {
      getBrand().then((res) => {
        this.arr = res.list;
      });
    },
    add() {
      brandAdd({ name: this.name }).then((res) => {
        alert(res.msg);
        // 刷新列表
        this.getBrandList()
        // 清空输入框
        this.name = "";
      });
    },
  },
  components: {},
};
</script>
<style scoped>
</style>